<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns:th="https://www.thymeleaf.org" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link th:href="@{/css/shop.css}" type="text/css" rel="stylesheet"/>
    <link th:href="@{/css/Sellerber.css}" type="text/css" rel="stylesheet"/>
    <link th:href="@{/css/bkg_ui.css}" type="text/css" rel="stylesheet"/>
    <link th:href="@{/font/css/font-awesome.min.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/js/jquery-1.9.1.min.js}" type="text/javascript"></script>

    <script th:src="@{/js/Backgroundjs/index.js}" type="text/javascript"></script>

    <script th:src="@{/js/echarts.js}" type="text/javascript"></script>
    <script th:src="@{/js/echarts.common.min.js}" type="text/javascript"></script>

    <script type="text/javascript" th:src="@{../js/jquery.cookie.js}"></script>
    <script th:src="@{/js/Sellerber.js}" type="text/javascript"></script>
    <script th:src="@{/js/shopFrame.js}" type="text/javascript"></script>
    <script th:src="@{/js/dist/echarts.js}" type="text/javascript"></script>
    <script th:src="@{/js/jquery.nicescroll.js}" type="text/javascript"></script>
    <!--[if lt IE 9]>
    <script th:src="@{../js/html5shiv.js}" type="text/javascript"></script>
    <script th:src="@{../js/respond.min.js}"></script>
    <script th:src="@{../js/css3-mediaqueries.js}" type="text/javascript"></script>nnnnn
    <![endif]-->
    <title>首页</title>
</head>

<body id="iframe_box">
<div id="index_style" style="height:100%" class="clearfix">
    <div class="spacing_style"></div>
    <div class="margin-bottom clearfix ">
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-4">
            <a href="javascript:ovid()" class="tile-button btn_Plate bg-deep-blue">
                <div class="carousel Module_info">
                    <div class="left_img bg_color_bule">
                        <i class="fa fa-cny"></i>
                        <h3>成交金额</h3>
                    </div>
                    <div class="right_info" id="cjjine">4567.89元</div>
                </div>
            </a>
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-4">
            <a href="javascript:ovid()" class="tile-button btn_Plate bg-red ">
                <div class="carousel Module_info">
                    <div class="left_img bg_color_red">
                        <i class="fa fa-shopping-cart"></i>
                        <h3>成交订单</h3>
                    </div>
                    <div class="right_info" id="cjzongshu">4567笔</div>
                </div>
            </a>
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-4">
            <a href="javascript:ovid()" class="tile-button btn_Plate bg-green">
                <div class="carousel Module_info">
                    <div class="left_img bg_color_green">
                        <i class="fa  fa-comments-o"></i>
                        <h3>会员人数</h3>
                    </div>
                    <div class="right_info" id="vipPeople">4567条</div>

                </div>
            </a>
        </div>

        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-4">
            <a href="javascript:ovid()" class="tile-button btn_Plate bg-orange">
                <div class="carousel Module_info">
                    <div class="left_img bg_color_orange">
                        <i class="fa  fa-volume-up "></i>
                        <h3>今日新增会员</h3>
                    </div>
                    <div class="right_info" id="vipByToday">456条</div>
                </div>
            </a>
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-4">
            <a href="javascript:ovid()" class="tile-button btn_Plate bg-purple">
                <div class="carousel Module_info">
                    <div class="left_img bg_color_purple">
                        <i class="fa  fa-clock-o "></i>
                        <h3>问题反馈</h3>
                    </div>
                    <div class="right_info" id="questionCount">17条</div>
                </div>
            </a>
        </div>
        <div class="col-xs-2 col-sm-2 col-md-2 col-lg-4">
            <a href="javascript:ovid()" class="tile-button btn_Plate bg-yellow">
                <div class="carousel Module_info">
                    <div class="left_img bg_color_yellow">
                        <i class="fa  fa-clock-o "></i>
                        <h3>今日总浏览量</h3>
                    </div>
                    <div class="right_info">10条</div>
                </div>
            </a>
        </div>
    </div>
    <div class="center  clearfix margin-bottom">
        <!--店铺信息-->
        <div class="col-lg-2 col-xs-3 col-md-3 ">
            <div class="com_plate_style clearfix">
                <div class="set-time clearfix" id="set-time"></div>
            </div>
        </div>
        <div class="col-lg-7 col-xs-6 col-md-6 ">
            <div class="Shops_info clearfix frame">
                <div class="left_shop">
                    <div class="left_shop_logo">
                        <div class="shop_logo"><span class="bg_yuan"></span><img th:src="@{/images/pnlogo.png}"/>
                        </div>
                        <a href="#" class="btn bg-deep-blue paddings">进入首页</a>
                    </div>
                    <div class="Shops_content">

                        <ul class="clearfix" >
                            <li><label class="name">商城名称：</label>票牛网</li>
                            <li><label class="name">商城类型：</label>电子商务</li>
                            <li><label class="name">销售类型：</label>卖票</li>
                            <li><label class="name">成立时间：</label>2016-08-21</li>
                            <li style="width: 380px"><label class="name">介绍：</label>票牛，隶属于上海颂品网络科技有限公司，是现场娱乐票务第三方交易平台，解决了用户买票难，买票贵，和无法退票，售后混乱的问题，是一款真正服务于消费者的票务平台。</li>
                        </ul>
                    </div>

                    <!--<div class="right_shop">
                        <p> 店铺动态评分：</p>
                        <ul>
                            <li><label class="name">相符描述</label><span class="score">4.5分</span></li>
                            <li><label class="name">服务态度</label><span class="score">4.0分</span></li>
                            <li><label class="name">发货速度</label><span class="score">4.6分</span></li>
                        </ul>
                    </div>-->
                </div>
                <!--<div class="operating_style Quick_operation menuUl">
                    <ul class="submenu">
                        <li class=""><a href="javascript:void(0)" name="add_product.html" class="btn"
                                        title="添加产品">添加产品</a></li>
                        <li class=""><a href="javascript:void(0)" name="add_Advertising.html" class="btn"
                                        title="添加广告">添加广告</a></li>
                        <li class=""><a href="javascript:void(0)" name="add_Article.html" class="btn"
                                        title="添加文章">添加文章</a></li>
                        <li class=""><a href="javascript:void(0)" name="add_Singlepag.html" class="btn"
                                        title="新增单页面">新增单页面</a></li>
                    </ul>
                </div>-->
            </div>
        </div>
        <div class=" col-xs-3">
            <div class="admin_info frame clearfix">
                <div class="title_name"><i></i>登陆记录 <a href="#">+更多</a></div>
                <table class="record_list table table_list">
                    <tbody>
                    <tr>
                        <td>管理员</td>
                        <td>2016-08-04 12:45:43</td>
                    </tr>
                    <tr>
                        <td>管理员</td>
                        <td>2016-08-14 23:34:23</td>
                    </tr>
                    <tr>
                        <td>管理员</td>
                        <td>2016-08-24 11:34:53</td>
                    </tr>
                    <tr>
                        <td>管理员</td>
                        <td>2016-08-24 11:34:53</td>
                    </tr>
                    <tr>
                        <td>管理员</td>
                        <td>2016-08-24 11:34:53</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <!---->
    <div class="Order_form ">
        <div class="col-xs-6 col-lg-7">
            <div class="frame margin-right clearfix">
                <div class="title_name"><i></i>销售额展示</div>


                <!--<div class="clearfix">
                        <div class="col-xs-3 col-lg-6 ">
                            <div class="prompt_name"><i class="icon_Order"></i>订单& 商品</div>
                            <ul class="padding list_info">
                                <li>代发货订单 &nbsp;<a href="">(02)</a></li>
                                <li>已完成订单 &nbsp;<a href="">(32)</a></li>
                                <li>未完成订单 &nbsp;<a href="">(02)</a></li>
                            </ul>
                        </div>
                        <div class="col-xs-3 col-lg-6">
                            <div class="prompt_name"><i class="icon_Promotions"></i>促销</div>
                            <ul class="padding list_info">
                                <li>待审核的促销 &nbsp;<a href="">(02)</a></li>
                                <li>发布的促销 &nbsp;<a href="">(32)</a></li>
                                <li>即将结束的促销 &nbsp;<a href="">(02)</a></li>
                            </ul>
                        </div>
                        <div class="col-xs-3 col-lg-6">
                            <div class="prompt_name"><i class="icon_Aftermarket"></i>售后</div>
                            <ul class="padding list_info">
                                <li>待处理订单 &nbsp;<a href="">(02)</a></li>
                                <li>待退款订单 &nbsp;<a href="">(32)</a></li>
                                <li>待处理售后单 &nbsp;<a href="">(02)</a></li>
                            </ul>
                        </div>
                        <div class="col-xs-3 col-lg-6 ">
                            <div class="prompt_name"><i class="icon_Billing"></i>结算</div>
                            <ul class="padding list_info">
                                <li>待支付 &nbsp;<a href="">(02)</a></li>
                                <li>待结算确认 &nbsp;<a href="">(32)</a></li>
                            </ul>
                        </div>
                    </div>
                -->


                    <div id="main" style="width:100%; height:380px"></div>
                </div>
            </div>
        </div>
        <div class="col-xs-6 ranking_style col-lg-5">
            <div class="frame clearfix">
                <div class="title_name"><i></i>商品销售排行</div>
                <table class="table table_list ranking_list">
                    <thead>
                    <th width="50">排名</th>
                    <th>商品编号</th>
                    <th>商品名称</th>
                    <th width="80">销售数量</th>
                    </thead>
                    <tbody id="paihang">
                    <!--<tr>
                        <td><em>1</em></td>
                        <td>2345776</td>
                        <td><a href="#">联想（ThinkPad ）轻薄系列</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>2</em></td>
                        <td>2345776</td>
                        <td><a href="#">施巴（sebamed）婴儿泡泡沐浴露200ml家庭装</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>3</em></td>
                        <td>2345776</td>
                        <td><a href="#">七匹狼纯棉时尚休闲条纹翻领POLO衫T恤</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>4</em></td>
                        <td>2345776</td>
                        <td><a href="#">桂格即食燕麦片超值装1478g</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>5</em></td>
                        <td>2345776</td>
                        <td><a href="#">韩国爱敬挚爱香氛花香洗护套装（洗发水600ml+护发素</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>6</em></td>
                        <td>2345776</td>
                        <td><a href="#">韩国爱敬挚爱香氛花香洗护套装（洗发水600ml+护发素</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>7</em></td>
                        <td>2345776</td>
                        <td><a href="#">韩国爱敬挚爱香氛花香洗护套装（洗发水600ml+护发素</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>8</em></td>
                        <td>2345776</td>
                        <td><a href="#">韩国爱敬挚爱香氛花香洗护套装（洗发水600ml+护发素</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>9</em></td>
                        <td>2345776</td>
                        <td><a href="#">韩国爱敬挚爱香氛花香洗护套装（洗发水600ml+护发素</a></td>
                        <td>23</td>
                    </tr>
                    <tr>
                        <td><em>10</em></td>
                        <td>2345776</td>
                        <td><a href="#">韩国爱敬挚爱香氛花香洗护套装（洗发水600ml+护发素</a></td>
                        <td>23</td>
                    </tr>-->
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    var option
    var myChart
    //设置框架
    $(function () {
        $("#iframe_box").frame({
            float: 'left',
            Scroll: '#index_style',
            color_btn: '.skin_select',
            Sellerber_menu: '.list_content',
            page_content: '.list_show',//内容
            datalist: ".datatable_height",//数据列表高度取值
            time: '#set-time',
        });

        //统计图
        myChart = echarts.init(document.getElementById('main'));//基于准备好的dom，初始化echarts实例
        initChart();     //初始化
        showWeight();    //加载值

        //成交订单
        $.post("/mainOrder/selectZongCount", function (data) {
            document.getElementById('cjzongshu').innerHTML = data + "笔";
        });
        //成交金额
        $.post("/mainOrder/selectTotalPrice", function (data) {
            document.getElementById('cjjine').innerHTML = data + "元";
        });
        //会员总数
        $.post("/user/getUsers", function (data) {
            document.getElementById('vipPeople').innerHTML = data + "位";
        });
        //今日新增会员数
        $.post("/user/getVIPByToday", function (data) {
            document.getElementById('vipByToday').innerHTML = data + "位";
        });
        //问题总数
        $.post("/Question/statQuestionCount", function (data) {
            document.getElementById('questionCount').innerHTML = data + "条";
        });



    });

    function initChart() {
        option = {
            title: {
                text: "趋势表",
                x: "center"
            },
            tooltip: {
                trigger: 'axis'     //气泡
            },
            legend: {
                x: 'left',
                data: []
            },
            xAxis: [
                {
                    type: "category",
                    name: "日期",
                    splitLine: {show: false},
                    data: []
                }
            ],
            yAxis: [
                {
                    type: "value",
                    axisLabel: {
                        formatter: '{value} 元'
                    },
                    name: "销售额"
                }
            ],
            toolbox: {
                show: true,
                feature: {
                    mark: {show: true},
                    /*dataView: {show: true, readOnly: true},*/
                    magicType: {show: true, type: ['line', 'bar']},
                    saveAsImage: {show: true}
                }
            },
            calculableColor: true,       //是否启用拖拽重计算特性，默认关闭
            series: []
        };
    }

    function getDay(num, str) {
        var today = new Date();
        var nowTime = today.getTime();
        var ms = 24 * 3600 * 1000 * num;
        today.setTime(parseInt(nowTime + ms));
        var oYear = today.getFullYear();
        var oMoth = (today.getMonth() + 1).toString();
        if (oMoth.length <= 1) oMoth = '0' + oMoth;
        var oDay = today.getDate().toString();
        if (oDay.length <= 1) oDay = '0' + oDay;
        return oYear + str + oMoth + str + oDay;
    }

    function showWeight() {
        $.ajax({
            type: "GET",
            url: "/mainOrder/selectPriceSum",
            dataType: "json",
            data: {},
            success: function (r) {

                initChart();
                //option.title.text = r.username+"的体重"
                //option.legend.data[0] = r.username
                option.series[0] = {"name": "销售额", "type": "line", "data": []}
                //option.series[0].name = r.username
                //option.series[0].type = 'line'

                for (var i = -6, j = 0; i < 1, j < 7; i++, j++) {
                    //alert(getDay(i,"-"));    //当天日期
                    //alert(r[getDay(i,"-")]);     //当天总金额

                    option.series[0].data[j] = r[getDay(i, "-")];        //y
                    option.xAxis[0].data[j] = getDay(i, "-");         //x
                }
                /*


                                for (var i in r) {
                                    option.series[0].data[i] = r[i].more1;
                                    option.xAxis[0].data[i] = r[i].payTime
                                }*/


                //option.series[1] = {"name": r.username, "type": "line", "data": [1,2,8,12,21,9]}

                myChart.setOption(option)
            }
        });
    }

    /*********************/

</script>
